import "./App.css";
import { Link } from "react-router-dom";

import { useRoutes } from "react-router-dom";
import routes from "./route/routes";
function App() {
 const element = useRoutes(routes);
  return (
    <div
      style={{
        position: "relative",
        width: "100%",
        height: "100%",
        minHeight: "100vh",
        backgroundColor: "white",
      }}
    >
      {/* 顶部导航栏 */}
      <div>
        <nav
          style={{
            display: "flex",
            gap: "20px",
            padding: "10px 20px",
            background: "#f0f0f0",
            borderBottom: "1px solid #ddd",
          }}
        >
          <Link to="/" style={{ textDecoration: "none" }}>
            首页
          </Link>
          <Link to="/chat" style={{ textDecoration: "none" }}>
            Chat
          </Link>
        </nav>
      </div>
      {/* 渲染 route 对应的页面 */}
      {element}
    </div>
  );
}

export default App;
